<%@ page language="java"  pageEncoding="UTF-8"%>
<head>
  <link href="http://vjs.zencdn.net/5.8.8/video-js.css" rel="stylesheet">
  <!-- If you'd like to support IE8 -->
  <script src="http://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script>

<style type="text/css">
.vjs-paused .vjs-big-play-button,
.vjs-paused.vjs-has-started .vjs-big-play-button {
    display: block;
}

</style>
<script>

</script>  
</head>

<body>
	<!-- Video.js是一款web视频播放器，支持html5和flash两种播放方式。
	
		data-setup参数选项：
			controls : true/false 是否拥有控制条 【默认true】,如果设为false ,那么只能通过api进行控制了。也就是说界面上不会出现任何控制按钮
			autoplay :  true/false   播放器准备好之后，是否自动播放 【默认false】
			height: 视频容器的高度，字符串或数字 单位像素
			width: 视频容器的宽度, 字符串或数字 单位像素
			loop : true/false 视频播放结束后，是否循环播放
			muted : true/false 是否静音
			poster: 播放前显示的视频画面，播放开始之后自动移除。通常传入一个URL
			preload:预加载 
				'auto' 自动
	            'metadata' 元数据信息 ，比如视频长度，尺寸等
	　　　　		'none'  不预加载任何数据，直到用户开始播放才开始下载
			sources:Array 资源文件
				例如：sources: [{src: '//path/to/video.mp4',type: 'video/mp4'},
					  		  {src: '//path/to/video.webm',type: 'video/webm'}]
					效果与<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">一样
			techOrder: Array 使用哪种技术播放，可选值有‘html5‘,‘flash‘  默认为[‘html5‘], 注意： 在v6.0.0 及以上的版本中，默认不包含flash的使用代码。
				如果要使用flash播放的，需要手动引入flash相关逻辑的代码。且需要指定swf文件的路径。		
					
	 -->
  <video id="my-video" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264"
  		poster="${pageContext.request.contextPath }/static/images/custom_c.png" 
  		data-setup='{"autoplay":"true"}'>
  	<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
    <source src="http://vjs.zencdn.net/v/oceans.webm" type='video/webm'>
    <p class="vjs-no-js">
      To view this video please enable JavaScript, and consider upgrading to a web browser that
      <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
  </video>

  <script src="http://vjs.zencdn.net/5.8.8/video.js"></script>
</body>